<template>
	<view>
		<view class="border-bottom px-3">
			<view class="py-2 font32 font-weight-500">当前班级：</view>
			<view class="flex align-center flex-wrap pb-2">
				<view class="items" v-for="(item,index) in itemlist" :key="index">{{item}}</view>
			</view>
		</view>
		<view class="border-bottom px-3">
			<view class="py-2 font32 font-weight-500">任课班级：</view>
			<view>
				<u-checkbox-group v-model="checkboxValue" placement="column" @change="checkboxChange">
					<u-checkbox :customStyle="{marginBottom: '8px'}" v-for="(item, index) in checkboxList" :key="index"
						:label="item.class_name" :name="item.class_id">
					</u-checkbox>
				</u-checkbox-group>
			</view>
		</view>
		<view class="px-3">
			<view class="item">
				<view class="py-2 font30"><textarea value="" @blur="bindTextAreaBlur"
						style="width: 100%;height: 250rpx;" placeholder="输入作业内容" /></view>
				<view class="">
					<view class="font30 color333">上传照片</view>
					<view class="pt-2 pb-3 flex align-center">
						<view class="flex mr-3" v-if="file!=''">
							<image v-for="(item,index) in file" :key="index" :src="imgTip+item"
								style="width:120rpx;height:120rpx;margin-right: 10rpx;" mode=""></image>
						</view>
						<view v-if="imgNum!=0" @click="addimg" class="flex border align-center justify-center"
							style="width: 120rpx;height: 120rpx;">
							<image src="../../../../static/img/ic_add.png" style="width:120rpx;height:120rpx;" mode="">
							</image>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="fixed-bottom px-5 pb-3" v-show="!loadingpage">
			<main-button @click="toLeave">发布</main-button>
		</view>
		<u-loading-page :loading="loadingpage" loading-text="正在发布..." :bg-color="'rgba(000, 000, 000	, 0.5)'"></u-loading-page>
	</view>
</template>

<script>
	import mainButton from '@/components/common/main-buttom.vue';
	export default {
		data() {
			const currentDate = this.getDate({
				format: true
			});
			return {
				file: [],
				vcContent: "",
				imgNum: 4,
				checkboxValue: [],
				checkboxList: [],
				itemlist: [],
				startDate: currentDate,
				loadingpage:false,
			}
		},
		components: {
			mainButton
		},
		onShow() {
			this.checkboxList = uni.getStorageSync('userInfo').class_info
		},
		methods: {
			bindTextAreaBlur: function(e) {
				console.log(e.detail.value);
				this.vcContent = e.detail.value;
			},
			checkboxChange(e) {
				console.log(e);
				this.itemlist = [];
				if (e != "") {
					e.forEach((item) => {
						this.checkboxList.forEach((items) => {
							if (item == items.class_id) {
								this.itemlist.push(items.class_name)
							}
						})
					})
				}
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			addimg() {
				uni.chooseImage({
					count: this.imgNum,
					success: chooseImageRes => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						console.log(tempFilePaths);
						this.imgNum = this.imgNum - tempFilePaths.length;
						for (var i = 0; i < tempFilePaths.length; i++) {
							uni.uploadFile({
								url: this.$http.baseUrl + '/FileUpload.shtml', //仅为示例，非真实的接口地址
								filePath: tempFilePaths[i],
								name: 'file',
								formData: {},
								success: uploadFileRes => {
									console.log(uploadFileRes);
									if (uploadFileRes.statusCode == 200) {
										let data = JSON.parse(uploadFileRes.data);
										this.imgTip = data.corePath;
										this.file.push(data.fileUrl);
									}
								}
							});
						}
					}
				});
			},
			toLeave() {
				let this_ = this;
				this_.loadingpage=true;
				let opts = {
					url: 'Ls/SaveLsZy.shtml'
				};
				let param = {
					longLsId: uni.getStorageSync("masterId"),
					longBjId: this.checkboxValue.toString(),
					vcZyxq: this_.vcContent,
					file: this_.file
				};
				this_.$http.httpRequest(opts, param).then(
					res => {
						console.log(res.data);
						this_.loadingpage=false;
						if (res.data.code == '200') {
							uni.navigateBack({
								delta: 1
							})
						} else {
							uni.showToast({
								icon: 'none',
								title: res.data.msg
							});
						}
					},
					error => {
						console.log(error);
					}
				);
			}
		}
	}
</script>

<style>
	.items {
		padding: 6rpx 10rpx;
		background-color: #efefef;
		border-radius: 8rpx;
		margin-right: 20rpx;
	}
	.fixed-bottom{
		z-index:9
	}
</style>
